<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>对象类型</title>
</head>
<body>


<div id="divText">
    我是一个div
    请不要把字符串、数值和布尔值声明为对象！
    如果通过关键词 "new" 来声明 JavaScript 变量，则该变量会被创建为对象; 类似 java 中的int 和 Integer
</div>

<input type="button" id="btn1" value="点击修改div中的文字" onclick="btn1_onclick"/>
<input type="checkbox" name="click me" id=""/>

<ol>
    有不同的方法来创建对象：

    <li>定义和创建单个对象，使用对象文字。</li>
    <li>定义和创建单个对象，通过关键词 new。</li>
    <li>定义对象构造器，然后创建构造类型的对象。</li>
</ol>

</body>

<script>
    //大名鼎鼎的document 就是DOM 对象
    console.log("document: " + document); //  document: [object HTMLDocument]
    let divText = document.getElementById("divText");
    console.log("divText: " + divText); //divText: [object HTMLDivElement]


    let btn1 = document.getElementById("btn1");
    console.log("btn1: " + btn1);

    function btn1_onclick() {
        divText.innerText = "我的文本已经被修改";
    }

    /**
     * 使用对象字面量
     这是创建对象最简答的方法。
     使用对象文字，您可以在一条语句中定义和创建对象。
     * */
    var user = {
        username: "sky",
        age: "22",
        school: "NCEPU",
        study: function (subject) {
            this.username + "学习的科目是" + subject
        }
    };
    /**
     * 使用 JavaScript 关键词 new ,  idea 会报黄,  提示你 replace with object literal
     *
     * */
    var person = new Object();
    person.firstName = "Bill";
    person.lastName = "Gates";
    person.age = 50;
    person.eyeColor = "blue";


    function add(num1, num2) {
        return num1 + num2;
    }

    var now = new Date();

    console.log('user ==> ', user);
    console.log('add ==> ', add);
    console.log('now ==> ', now);


    console.log('typeof user ==> ', typeof user);
    console.log('typeof add ==> ', typeof add);
    console.log('typeof now ==> ', typeof now);


    var str = new String();        // 把 str 声明为 String 包装对象
    var num = new Number();        // 把 num 声明为 Number 包装对象
    var isLogin = new Boolean();       //把 isLogin 声明为 Boolean 包装对象


    console.log('num ==> ', num);
    console.log('str ==> ', str);
    console.log('isLogin ==> ', isLogin);


    console.log('typeof num ==> ', typeof num);
    console.log('typeof str ==> ', typeof str);
    console.log('typeof isLogin ==> ', typeof isLogin);


</script>


</html>
